<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 
<%@page isELIgnored="false" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html style="overflow-y: visible;">
    <jsp:include page="../../../include/IncludeMain.jsp"></jsp:include>
  <body style="overflow-y: visible!important;overflow-y: scroll;" onload="setCount();">
	  <form action="${pageContext.request.contextPath }/pages/business/rule.do?act=saveCat" name="myForm" id="myForm" method="post">
	    	<table class="mainTable">
				<thead>
					<tr class="tableController">
						<th colspan="2">
							<h3>规则编辑</h3>
						</th>
					</tr>
					<tr>
						<th>&nbsp;	</th>
						<th class="errorTip" style='<c:if test="${empty message}">display:none</c:if>'>
							<c:forEach items="${message}" var="m">
								${m }
							</c:forEach>
						</th>
					</tr>
					<tr class="tableTitle">
						<th>
							<h3>&nbsp;</h3>
						</th>
						<th>
							<h3>&nbsp;</h3>
						</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td align="right"><h4>规则:&nbsp;&nbsp;</h4></td>
						<td id="rule">
							<input type="hidden" name="rule_id" id="rule_id" value="${rule.id }"/> 
							<input type="hidden" name="att_p" id="att_p" value=""/> 
							<c:forEach items="${catList}" var="cat" varStatus="i">
								<div style="width:180px;float:left;margin-right:30px;">
									<span style="font-size:18px;">${cat.name }:</span>
										<ul id="${i.index }">
											<c:forEach items="${attList[i.index] }" var="attribute">
												<li>
													<input type="text" disabled="disabled" value="${attribute.att_key }" style="width:80px;float:none;"> - 
													<input type="text" disabled="disabled" value="${attribute.att_value }" style="width:80px;float:none;">
												</li>
											</c:forEach>
										</ul>
										<a class="button" href="javascript:void(0)" onclick="this.blur();addAttribute(${i.index});"; return false;>
											<span><img src="${pageContext.request.contextPath }/js/kui/icons/application_add.png" align="absmiddle"/>&nbsp;添加</span>
										</a>
								</div>
							</c:forEach>
						</td>
					</tr> 
				</tbody>
				<tfoot>
					<tr  class="tableController_bottom">
						<td align="center">
							&nbsp;
						</td>
						<td align="left">
							<a class="button" href="javascript:void(0)" onclick="this.blur(); test();'return false';"><span><img src="${pageContext.request.contextPath }/js/kui/icons/disk.png" align="absmiddle"/>&nbsp;保存</span></a>
							<a class="button" href="javascript:void(0)" onclick="this.blur(); history.go(-1);'return false';"><span><img src="${pageContext.request.contextPath }/js/kui/icons/anticlockwise.png" align="absmiddle"/>&nbsp;返回</span></a>
						</td>
					</tr>
				</tfoot>
		</table>
		</form>
		<script type="text/javascript">
			var formId = 'myForm';
			var valid = new KUI.Validation({formId: formId, immediate: true });
			function save(){
				if(valid.validate()){
					document.getElementById(formId).submit();
				}
			}

			function addAttribute(id){
				document.getElementById(id).innerHTML += "<li><em></em><input type='text' value='' id='att_key' style='width:80px;float:none;'> - <input type='text' value='' id='att_value' style='width:80px;float:none;'></li>";
			}
			
			var category_count = 0;
			function setCount(){
				category_count = "${fn:length(catList)}";
			}
			
			function test()
			{
				 fm = document.getElementById('myForm');
				 vkey = fm.att_key;
				 vvalue = fm.att_value;
				 var k =0;
				 var att = "";
				 var c = document.getElementById("rule").getElementsByTagName("em").length;
				 if(1 == c)
				 {
					 for(var i = 0; i < category_count; i ++)
					 {
						var l = document.getElementById(i).getElementsByTagName("em").length;
						if(c == l)
						{
							att += vkey.value + "," + vvalue.value + "/";
						}
						att += "&";
					 }
				 }
				 else
				 {
					 for(var i = 0; i < category_count; i ++){
						 var l = document.getElementById(i).getElementsByTagName("em").length;
						 for(var j = k; j < k+l; j ++){
							 att += vkey[j].value + "," + vvalue[j].value + "/";
						 }
						 att += "&";
						 k = k + l;
					 }
				 }
				 document.getElementById("att_p").value = att;
				 fm.submit();
			}
		</script>
  </body>
</html>
